<template>
  <div>
    <!-- 操作信息 -->
    <div class="actionInfo bb boxItem">
      <h4 class="withVerticleLineT4 title14">{{ $t('operationInfo') }}</h4>
      <div class="descBox">
        <div class="descCol1">
          <div class="descItem">
            <span class="descTitle">{{ $t('applicant') }}</span>
            <span class="descValue">
              <table-ellipsis :tableEllipsisIsTurnLine="false" :text="info.createBy || '-'"></table-ellipsis>
            </span>
          </div>
        </div>
        <div class="descCol2">
          <div class="descItem">
            <span class="descTitle">{{ $t('applicationTime') }}</span>
            <span class="descValue">
              <table-ellipsis :tableEllipsisIsTurnLine="false" :text="$commonFun.getDateTimeStr(info.createTime)"/>
            </span>
          </div>
        </div>
      </div>
    </div>
    <!-- 基本信息 -->
    <div class="baseInfo bb boxItem">
      <h4 class="withVerticleLineT4 title14">{{ $t('basicInformation') }}</h4>
      <!-- 审核项是任务时 -->
      <div class="descBox">
        <div class="descCol1">
          <!-- 任务名称 -->
          <div class="descItem">
            <span class="descTitle">{{ $t('campaignName') }}</span>
            <span class="descValue">
              <table-ellipsis :tableEllipsisIsTurnLine="true" :text="linkedInfo.name || '-'"></table-ellipsis>
            </span>
          </div>
          <!-- 升级策略 -->
          <div class="descItem">
            <span class="descTitle">{{ $t('sjcl') }}</span>
            <span class="descValue">
              <a @click="lookupSjcl(linkedInfo.strategyId, 1)">
                <table-ellipsis :tableEllipsisIsTurnLine="false" :text="linkedInfo.strategyName || '-'"/>
              </a>
            </span>
          </div>
        </div>
        <div class="descCol2">
          <!-- 有效期 -->
          <div class="descItem">
            <span class="descTitle">{{ $t('expirationDate') }}</span>
            <span class="descValue">
              <table-ellipsis
                :tableEllipsisIsTurnLine="false"
                :text="
                  $commonFun.getDateMinuteStr(linkedInfo.startTime) +
                    '~' +
                    $commonFun.getDateMinuteStr(linkedInfo.endTime)
                "
              ></table-ellipsis>
            </span>
          </div>
          <!-- linkedInfo.type为2自动升级对是否静默升级，linkedInfo.type为1用户升级对是否强制升级 -->
          <div class="descItem">
            <span class="descTitle">{{ $t(linkedInfo.type === 2 ? 'sfjmsj' : 'isQzsj') }}</span>
            <span class="descValue">
              <table-ellipsis :tableEllipsisIsTurnLine="false" :text="updateMethodValue"></table-ellipsis>
            </span>
          </div>
        </div>
        <div class="descCol3">
          <!-- 升级类型 -->
          <div class="descItem">
            <span class="descTitle">{{ $t('upgradeType') }}</span>
            <span class="descValue">
              <table-ellipsis :tableEllipsisIsTurnLine="false" :text="taskTypeObj[linkedInfo.type] || '-'"/>
            </span>
          </div>
        </div>
      </div>
      <div class="descBox">
        <div class="descColFull">
          <!-- 任务备注 -->
          <div class="descItem">
            <span class="descTitle">{{ $t('taskRemark') }}</span>
            <span class="descValue">{{ linkedInfo.remark || '-' }}</span>
          </div>
        </div>
      </div>
    </div>
    <!-- 审核项是任务时升级车辆start -->
    <div class="baseInfo bb boxItem">
      <h4 class="withVerticleLineT4 title14">{{ $t('upgradeVehicle') }}</h4>
      <div class="descBox">
        <div v-if="linkedInfo.totalVehicle">
          <span style="margin-right: 10px">{{ linkedInfo.totalVehicle }}{{ $t('tai') }}</span>
          <a @click="exportTaskVehicle(linkedInfo)">
            <span>{{ $t('export') }}</span>
            <a-spin :spinning="exporting" style="margin-left: 10px"></a-spin>
          </a>
        </div>
        <span v-else>-</span>
      </div>
    </div>
    <!-- 审核项是任务时升级车辆end -->
    <!-- 查看策略详情 -->
    <show-strategy-info ref="showStrategy" :updata-strategy-id="strategyId" :strategy-type="strategyType">
    </show-strategy-info>
  </div>
</template>
<script>
import TableEllipsis from '@/components/Ellipsis/TableEllipsis'
import ShowStrategyInfo from '@/views/components/ShowConditionUpdateStrategy'
import taskApi from '@/api/modules/task'
import { downloadBlobFile } from '@/utils/functions'
export default {
  components: {
    TableEllipsis,
    ShowStrategyInfo
  },
  props: {
    info: {
      type: Object,
      default () {
        return {}
      }
    },
    linkedInfo: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      strategyId: '',
      strategyType: 'Fota',
      exporting: false
    }
  },
  computed: {
    taskTypeObj () {
      return this.$store.getters.getTaskDictCodeObj('taskType')
    },
    updateMethodValue () {
      if (this.linkedInfo.type === 2) {
        // 自动升级
        return this.$t(this.linkedInfo.silenceUpgrade ? 'jmsj' : 'fjmsj')
      }
      if (this.linkedInfo.type === 1) {
        // 用户升级
        return this.$t(this.linkedInfo.forceUpgrade ? 'qzsj' : 'fqzsj')
      }
      return '-'
    }
  },
  methods: {
    // 查看升级策略
    lookupSjcl (strategyId, type) {
      this.strategyId = strategyId
      this.strategyType = type === 2 ? 'Sota' : 'Fota'
      if (this.strategyId) {
        this.$refs.showStrategy.visible = true
      }
    },
    // 导出任务车辆
    exportTaskVehicle (taskInfo) {
      this.exporting = true
      taskApi
        .exportTaskCars({ taskId: taskInfo.id, type: 1 })
        .then((res) => {
          downloadBlobFile(res, taskInfo.name + this.$t('selectedVehicle') + '.xlsx')
        })
    }
  }
}
</script>
<style lang="less" scoped>
 .descItem .descTitle {
    font-weight: bold;
    flex: 80px 0 0;
    // padding-right: 10px;
  }
</style>